/* You can add global styles to this file, and also import other style files */
@appColor: rgb(104, 190, 141);

@textSizeLarge: 40px;
@textSizeMiddle: 20px;
@textSizeSmall: 14px;

@widthXXL: 400px;
@widthXL: 300px;
@widthL: 200px;
@widthM: 150px;
@widthS: 100px;

@sizeL: 16px;
@sizeM: 8px;
@sizeS: 4px;

html {
  padding: 0 !important;
  font-size: @textSizeMiddle;
}

body {
  font-size: @textSizeSmall;
}

.filter {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-bottom: @sizeL;

  .span {
    display: flex;
    align-items: center;
  }

  .input {
    margin-right: @sizeM;
    margin-left: @sizeM;
    width: @widthL;

  }
  .button {
    display: flex;
    justify-content: center;
    margin-right: @sizeM;
    margin-left: @sizeM;
    width: @widthS;
  }
  .nz-select {
    margin-right: @sizeM;
    margin-left: @sizeM;
    min-width: @widthM;
  }
  .nz-range-picker {
    margin-right: @sizeM;
    margin-left: @sizeS;
  }

  .nz-date-picker {
    margin-right: @sizeM;
    margin-left: @sizeS;
  }
  .nz-month-picker {
    margin-right: @sizeM;
    margin-left: @sizeS;
  }




}

.overDiv {
  width: auto;
  max-width: @widthXXL;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.dialogDiv {

  .dialogItem {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: @sizeM;

    input {
      width: @widthXL;
    }
    textarea {
      width: @widthXL;
    }
    nz-date-picker {
      width: @widthXL;
    }
    nz-month-picker {
      width: @widthXL;
    }
    nz-select {
      width: @widthXL;
    }

    .dialogSpan {
      margin-right: @sizeM;
      text-align: right;
    }
  }

}

.dialogInput {
  width: @widthXL;
  margin: @sizeL auto;
}

.dialogSpinner {
  margin-top: @sizeL;
}

.tableBtn {
  margin: @sizeS;
  color: dodgerblue;
  cursor: pointer;
}

.tableRedBtn {
  margin: @sizeS;
  color: red;
}







